<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ include file="/decorators/taglibs.jsp"%>
	<div class="container">
		<div class="row">
			<div class="col-md-12">
				<div class="form-group">
					<textarea cols="80" rows="3" id="content" class="form-control" placeholder="请输入微博内容"></textarea><br>
					<input id="comment" type="button" class="btn btn-primary pull-right" value="发布">
				</div>
			</div>
		</div>
		<hr>
		<div class="row">
			<div class="col-md-12" id="new_added_weibo">
				
			</div>
		</div>
		<div class="row">
			<div class="col-md-12">
				<c:forEach var="status" items="${status.statuses }">
				<div class="panel panel-info">
					<div class="panel-heading">
						${status.text }
					</div>
			 		<c:if test="${status.retweetedStatus != null }">
					 	<div class="panel-body">
					 			<label class="text-primary">@${status.retweetedStatus.user.screenName }</label>
					    		${status.retweetedStatus.text}
					    </div>
			    	</c:if>
			    	<div class="panel-footer">
			    		<p class="text-left">
			    			<fmt:formatDate pattern="yyyy-MM-dd HH:mm:ss" value="${status.createdAt}" type="both"/> 来自:${status.source.name}
			    		</p>
			    		<p class="text-right">
							 转发(${status.repostsCount }) <a href="${ctx }/weibo/home/${status.id}" class="comment">评论(${status.commentsCount })</a>
			    		</p>
					</div>
				</div>
			    <hr>
	            </c:forEach>
			</div>
		</div>
	</div>	
	<script type="text/javascript">
	$("#comment").click(function(){ 
		$.ajax({
			type : "POST", 
			async: false, 
			dataType: "json",
			url : "${ctx}/api/update_status", 
			data : {
				statuses:$("#content").val()
				},
			success : function(status)
			{
				var content = "";
				content += '<div class="panel panel-info">';
				content += '<div class="panel-heading">';
				content += status.text;
				content += '</div>';
				if(status.retweetedStatus != null){
					content +='<div class="panel-body"><label class="text-primary">@'+status.retweetedStatus.user.screenName+'</label>'+status.retweetedStatus.text+'</div>'
				}
				content += '<div class="panel-footer">';
				content += '<p class="text-left">';
				content += status.createdAt+' 来自:'+status.source.name;
				content += '</p>';
				content += '<p class="text-right">';
				content += ' 转发('+status.repostsCount +') <a href="./weibo/home/'+status.id+'" class="comment">评论('+status.commentsCount +')</a>';
				content += '</p>';
				content += '</div>';
				content += '</div>';
				content += '<hr>';
				
				var old  = $("#new_added_weibo").html();
				$("#new_added_weibo").html(old+content);
				$("#content").val("");
			}
		});  
   });
	</script>
	